import React, { useContext, useEffect, useMemo } from 'react';
import { ConractControllerContext } from '../common';
import MyIcon from '@/components/MyIcon';
import { DetailInfoBottomBtnView } from './DetailInfoBottomBtnView';
import { renderWaterMarkDom } from '@/utils';

export const DetailInfoTopViewOA: React.FC = () => {
  /** 引入上下文 */
  const { styleFixCls, contractDetailInfo } = useContext(ConractControllerContext);

  /** 返回头部内容申请 */
  const renderTopTitleText = useMemo(() => {
    if (contractDetailInfo?.changeWay == 0) {
      return `${contractDetailInfo?.ownerName || '--'}的变更合同申请`;
    } else if (contractDetailInfo?.changeWay == 1) {
      return `${contractDetailInfo?.ownerName || '--'}的解除合同申请`;
    } else {
      return `${contractDetailInfo?.ownerName || '--'}的合同申请`;
    }
  }, [contractDetailInfo]);

  // 初始化水印
  // useEffect(() => {
  //   renderWaterMarkDom("contract_oa_page", true)
  //   return () => {
  //     renderWaterMarkDom("contract_oa_page", false)
  //   }
  // }, [])

  return (
    <div className={`${styleFixCls}infoViewOA-titleBox`}>
      <div className={`${styleFixCls}infoViewOA-titleBox-textValue`}>
        {contractDetailInfo?.ownerName && (
          <>
            <MyIcon type="icon-dian" />
            {renderTopTitleText}
          </>
        )}
      </div>

      <DetailInfoBottomBtnView position="top" />
    </div>
  );
};
